<template>
  <div>
    <div>
      <!-- 搜索框 -->
      <TopFilter :list="topFilterList" :cols="3" :rows="2" :labelWidth="'150'" @filterChange="changeHandle"
        @onCollapse="collapseHandle"></TopFilter>
      <!-- 回访历史列表 -->
      <FilterTable ref="table" height="500px" :columns="columns" :fetchapi="fetchApi" :params="fetchParams"
        :datakey="'rows'" :onColumnsChange="columns => (this.columns = columns)" />
    </div>
    <div :style="{
        position: 'absolute',
        left: 0,
        bottom: 0,
        right: 0,
        zIndex: 9,
        borderTop: '1px solid #e9e9e9',
        padding: '10px 20px',
        background: '#fff',
        textAlign: 'right'
      }">
      <!-- <el-button  @click="closeDrawer">返&nbsp;&nbsp;回</el-button> -->
    </div>
  </div>
</template>

<script>
  import { dictionary } from '@/utils/dictMixin';
  import { getVisitHistory } from '@/api/customerRepair/afterSaleVisit/resultEntry';
  import { getAllUser } from '@/api/customerRepair/usedCarVisit/resultEntry';
  import { exportExcelFile, arrayObjDeWeight } from '@/utils/index';
  export default {
    name: 'qiankehuifanglishi',
    mixins: [dictionary],
    props: {
      type: {
        type: String,
        default: 'add'
      },
      resData: {
        type: Object,
        default: {}
      }
    },
    data() {
      this.BaseTable = null;
      this.allData = {};
      return {
        flag: false,
        topFilterList: this.createTopFilterList(),
        fetchApi: getVisitHistory,
        fetchParams: { xhrAbort: true },
        columns: this.createTableColumns()
      };
    },
    computed: {},
    created() {
      this.getAllUser();
      this.getResData();
    },
    methods: {
      createTopFilterList() {
        return [
          {
            type: 'SELECT',
            label: '回访类型',
            fieldName: 'visitType',
            initialValue: 15721001,
            itemList: [
              {text: "售后回访", value: 15721001},
              {text: "销售回访", value: 15721002},
              {text: "二手车回访", value: 15721003},
              {text: "活动回访", value: 15721004},
              {text: "潜客回访", value: 15721005},
              {text: "战败回访", value: 15721006}
            ]
          }
        ];
      },
      createTableColumns() {
        return [
          {
            title: '序号',
            dataIndex: 'index',
            width: 70,
            sorter: true,
            render: props => {
              return <span>{props.row.index + 1}</span>;
            }
          },
          {
            title: '车主编号',
            dataIndex: 'ownerNo',
            width: 150,
            sorter: true,
            filter: true,
            filterType: 'input'
          },
          {
            title: '回访单号',
            dataIndex: 'hfdh',
            width: 150,
            sorter: true,
            filter: true,
            filterType: 'input',
            editType: 'select',
            editable: false
          },
          {
            title: '回访结果',
            dataIndex: 'hfjg',
            sorter: true,
            filter: true,
            filterType: 'input',
            render: props => {
              return <span>{this.createDictText(props.row.hfjg, '1075')}</span>;
            }
          },
          {
            title: '回访状态原因',
            dataIndex: 'hfztyy',
            sorter: true,
            filter: true,
            filterType: 'input',
            render: props => {
              return <span>{this.createDictText(props.row.hfztyy, '8084')}</span>;
            }
          },
          {
            title: '回访人',
            dataIndex: 'hfr',
            sorter: true,
            filter: true,
            filterType: 'checkbox',
            filterItems: [],
            editType: 'select',
            editable: false,
            editItems: []
          },
          {
            title: '回访时间',
            dataIndex: 'hfrq',
            sorter: true,
            filter: true,
            filterType: 'date-range',
            dateFormat: 'yyyy-MM-dd'
          },
          {
            title: '满意度得分',
            dataIndex: 'myddf',
            sorter: true,
            filter: true,
            filterType: 'input'
          },
          {
            title: '备注',
            dataIndex: 'bz',
            sorter: true,
            filter: true,
            filterType: 'input'
          },
          {
            title: '销售顾问',
            dataIndex: 'xsgw',
            width: 150,
            sorter: true,
            filter: true,
            filterType: 'input',
            editType: 'select',
            editable: false
          },
          {
            title: '客户名称',
            dataIndex: 'khmc',
            width: 150,
            sorter: true,
            filter: true,
            filterType: 'input'
          },
          {
            title: '客户电话',
            dataIndex: 'khyddh',
            width: 150,
            sorter: true,
            filter: true,
            filterType: 'input'
          },
          {
            title: '联系人',
            dataIndex: 'lxrmc',
            width: 150,
            sorter: true,
            filter: true,
            filterType: 'input'
          },
          {
            title: '联系人手机',
            dataIndex: 'lxryddh',
            width: 150,
            sorter: true,
            filter: true,
            filterType: 'input'
          },
          {
            title: '车牌号',
            dataIndex: 'pzh',
            width: 150,
            sorter: true,
            filter: true,
            filterType: 'input'
          }
        ];
      },
      mounted() {
        this.BaseTable = this.$refs.table.$refs.pageTable;
      },
      async getAllUser() {
        const res = await getAllUser();
        let data = arrayObjDeWeight(res.data, 'userId'); // 人员去重(解决前端报错)
        this.columns.find(x => x.dataIndex === 'hfr').filterItems = this.columns.find(item => item.dataIndex === 'hfr').editItems = data.map(x => ({
          value: x.userId + '',
          text: x.employeeName
        }));
      },
      async getResData(val) {
        let parm = {
          visitType: 15721001,
          ownerNo: this.resData.ownerNo,
          pzh: this.resData.pzh,
          khmc: this.resData.khmc

        };
        this.fetchParams = Object.assign({}, parm, { xhrAbort: false });
      },
      // 关闭页面
      closeDrawer() {
        this.$emit('cancle', false);
      },
      changeHandle(val) {
        const visitType = this.topFilterList.find(item => item.fieldName === 'visitType').editItems; // 处理人表格

        let parm = {
          visitType: visitType,
          ownerNo: this.resData.ownerNo,
          pzh: this.resData.pzh,
          khmc: this.resData.khmc
        };
        this.fetchParams = Object.assign({}, parm, { xhrAbort: false });
      },
      collapseHandle() {
        this.$nextTick(() => {
          this.BaseTable.EXECUTE_RESET_HEIGHT();
        });
      }
    }
  };
</script>

<style lang="less" scoped></style>
